{:W('Cate/header')}
{:W('Cate/left')}

<!--内容部分-->
<div class="content">
    <div class="title">
        <p>服务管理</p>
        <i class="icon-angle-right"></i>
        <p><a href="javascript:;" onClick="javascript :history.go(-1);" style="color:#515974">开通服务</a></p>
        <i class="icon-angle-right"></i>
        <p class="active">开通详情</p>
    </div>
    <div class="admin_list clearfix">
        <div class="main">
            <div class="main_title">
                <form action="{:U('open_record/service_details')}" method="get">
                    <ul class="clearfix">
                        <li>
                            <span>资源名称</span>
                            <input value="{$param.name}" maxlength="20" name="name" type="text" >
                        </li>

                            <input value="{$param.companyid}" maxlength="20" name="companyid" type="hidden" >
                        <li>
                            <span>服务状态</span>
                            <img src="__PUBLIC__/images/i_xiala.png" class="sj icon-sort-down">
                            <select name="servicestatus">
                                <option value="" <if condition="$param['servicestatus'] eq ''"> selected </if> >全部</option>
                                <option value="0" <if condition="$param['servicestatus'] eq '0'"> selected </if> >服务中</option>
                                <option value="1" <if condition="$param['servicestatus'] eq '1'"> selected </if> >已过期</option>
                                <option value="2" <if condition="$param['servicestatus'] eq '2'"> selected </if> >试用中</option>
                                <option value="3" <if condition="$param['servicestatus'] eq '3'"> selected </if> >已试用</option>
                                <option value="4" <if condition="$param['servicestatus'] eq '4'"> selected </if> >未开通</option>
                            </select>
                        </li>
                        <li>
                            <span>到期时间</span>
                            <if condition="$param['begintime'] eq true">
                                <input value="{$param.begintime|date='Y-m-d H:i:s',###}" readonly name="begintime" placeholder="请选择开始时间" type="text" id="begintime">
                                <else/>
                                <input value="" readonly name="begintime" placeholder="请选择开始时间" type="text" id="begintime">
                            </if>
                        </li>
                        <li style="border:none;">-</li>
                        <li>
                            <if condition="$param['endtime'] eq true">
                                <input value="{$param.endtime|date='Y-m-d H:i:s',###}" readonly name="endtime" placeholder="请选择结束时间" type="text" id="endtime">
                                <else/>
                                <input value="" readonly name="endtime" placeholder="请选择结束时间" type="text" id="endtime">
                            </if>
                        </li>
                        <button type="submit"><img src="__PUBLIC__/images/seach.png">搜索</button>
                    </ul>
                </form>
            </div>
            <div class="main_list">
                <div class="main_list_new">
                    <a href="javascript:;"><button id="add_client">开通服务</button></a>
                </div>
                <div class="main_list_list user_list" style="margin-top:15px;">
                    <dl>
                        <dt>
                            <span style="width:5%"><input type="checkbox" name="vehicle" value=""></span>
                            <span style="width:15%;text-align: left;padding-left:10px;">资源名称</span>
                            <span style="width:15%;text-align: left;padding-left:10px;">服务状态</span>
                            <span style="width:15%;text-align: left;padding-left:10px;">服务时长</span>
                            <span style="width:20%;text-align: left;padding-left:10px;">服务到期时间</span>
                            <span style="width:15%;text-align: left;padding-left:10px;">并发量</span>
                            <span style="width:15%;text-align: left;padding-left:10px;">操作</span>
                        </dt>
                        <volist name="array['details']" id='row' key="k">
                        <dd>
                            <span style="width:5%"><input type="checkbox" name="vehicle1" data-name="{$row.name}" data-status="{$row.servicestatus}" value="{$row.id}"></span>
                            <span style="width:15%;text-align: left;padding-left:10px;">{$row['name']}</span>
                            <span style="width:15%;text-align: left;padding-left:10px;">
                            <if condition="$row['servicestatus'] eq 0">
                                                服务中
                                    <elseif condition="$row['servicestatus'] eq 1"/>
                                                已过期
                                    <elseif condition="$row['servicestatus'] eq 2"/>
                                                试用中
                                    <elseif condition="$row['servicestatus'] eq 3"/>
                                                已试用
                                    <elseif condition="$row['servicestatus'] eq 4"/>
                                                未开通
                                </if>
                            </span>
                            <span style="width:15%;text-align: left;padding-left:10px;">
                                {$row['serviceduration']}

                            </span>
                            <span style="width:20%;text-align: left;padding-left:10px;">
                                 <if condition="$row['servicestatus'] neq 4 ">
                                     {$row['endtime']|date="Y-m-d H:i:s",###}
                                </if>
                            </span>
                            <span style="width:15%;text-align: left;padding-left:10px;">{$row['servicecount']}</span>
                            <span style="width:15%;text-align: left;padding-left:10px;">
                                <if condition="$row['servicestatus'] eq 0 ">
                                    <a  href="{:U('open_record/service_renew',['info'=>$row['json']])}">续费</a>
                                    <a  href="{:U('open_record/service_upgrade',['info'=>$row['json']])}">升级服务</a>
                                    <elseif condition=" ($row['servicestatus'] eq 3 || $row['servicestatus'] eq 4) && $freetest eq 0 "/>
                                    <a class="sy" href="javascript:;" data-json='{$row.json}'>免费试用</a>
                                    <elseif condition="$row['servicestatus'] eq 1"/>
                                    <a  href="{:U('open_record/service_renew',['info'=>$row['json']])}">续费</a>
                                </if>
                            </span>
                        </dd>
                        </volist>
                    </dl>
                </div>
            </div>
            <div class="fy" id="page"></div>
        </div>
    </div>
</div>
<!--弹框-->
<!--添加子组织-->
<div class="hk"></div>
<div class="add_group add_device" style="top:10%;">
    <div class="add_group_title">
        <img src="__PUBLIC__/images/i_guanbi.png" class="icon-remove">免费试用
    </div>
    <div class="add_group_center">
        <p style="padding: 0 20px;">确定为资源“<span id="resource_name">海康01-通道1</span>”开通免费试用服务？ 开通免费试用服务后该资源将获得7天，20个并发量的试用权限。</p>
    </div>
    <div class="add_group_btn">
        <button>确定</button>
        <button>取消</button>
    </div>
</div>
<script>
    layui.use('laydate', function() {
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
            elem: '#begintime', //指定元素
            format: 'yyyy-MM-dd HH:mm:ss', //日期格式
            type:'datetime',
        });

        laydate.render({
            elem: '#endtime', //指定元素
            format: 'yyyy-MM-dd HH:mm:ss', //日期格式
            type:'datetime',
        });
    });
    // 分页
    layui.use('laypage', function(){
        var laypage = layui.laypage;
        //执行一个laypage实例
        laypage.render({
            elem: 'page'
            ,count: "<?php echo $totnum; ?>"
            ,limit: "<?php echo $pagecount; ?>"
            ,layout: ['prev', 'page', 'next', 'limit', 'skip']
            ,curr:function(){
                var page = location.search.match(/pageid=(\d+)/);
                return page ? page[1] : 1;
            }()
            ,jump: function(obj,first){  //点击页码出发的事件
                if(first!=true){  //是否首次进入页面
                    var companyid = "<?php echo $param['companyid']; ?>";
                    var servicestatus = "<?php echo $param['servicestatus']; ?>";
                    var name = "<?php echo $param['name']; ?>";
                    var begintime = "<?php echo $param['begintime']; ?>";
                    if(begintime){
                        begintime = "<?php echo date('Y-m-d H:i:s',$param['begintime']); ?>";
                    }
                    var endtime = "<?php echo $param['endtime']; ?>";
                    if(endtime){
                        endtime = "<?php echo date('Y-m-d H:i:s',$param['endtime']); ?>";
                    }
                    var _url = "/open_record/service_details?pageid="+obj.curr+"&pagecount="+obj.limit;
                    if(companyid || servicestatus || name || begintime || endtime ){
                        _url = "/open_record/service_details?pageid="+obj.curr+"&pagecount="+obj.limit+"&companyid="+companyid+"&servicestatus="+servicestatus+"&begintime="+begintime+"&endtime="+endtime+"&name="+name;
                    }
                    window.location.href = _url;
                }
            }
        });
    });
    //全选
    selectCheckBox('input[name="vehicle"]','input[name="vehicle1"]');

    $(document).ready(function () {
        $('.main_list').find('.sy').each(function () {   // 免费试用弹窗
            var _this = $(this);
            getPopup(_this,$('.add_device'));
        });
        // 获取资源信息
        var resid;  // 资源id
        $('.main_list').on('click','.sy',function(){
            var dJson = $(this).data('json');
            $('#resource_name').text(dJson['name']);
            resid = dJson['id'];
        })

        // 提交免费试用
        $('.add_device button').eq(0).on('click',function(){
            $.post("{:U('/open_record/freeTrial_post')}",{'resid':resid},function(data){
                if(data.result == '0'){
                    layer.msg(data.msg,{icon:1,time:2000},function(){
                        location.reload();
                    });
                } else {
                    layer.msg(data.msg,{icon:2,time:2000});
                }
            })
        })

        // 开通服务
        $('.main_list_new').on('click','a',function(){
            // 验证是否存在可以开通的资源
            var _check = $('input[name="vehicle1"]:checked');
            if(!_check.length) {
                layer.msg('请选择服务状态为已过期、已试用、未开通的资源',{icon:2,time:2000});
                return false;
            }
            var resid = '';   // 资源id
            var resname = '';  // 资源名称
            var companyid={$param.companyid};
            _check.each(function(){
                var _status = $(this).data('status');
                var arr = [1,3,4];
                if($.inArray(_status,arr) != '-1'){   // 可以开通的资源
                    resid += $(this).val()+',';
                    resname += $(this).data('name')+',';
                }
            })
            if(!resid){
                layer.msg('请选择服务状态为已过期、已试用、未开通的资源',{icon:2,time:2000});
                return false;
            }
            window.location.href = '/open_record/service_order?resid='+resid+'&resname='+resname+'&companyid='+companyid;
        })

    })
</script>
</body>
</html>